<template>
  <div class="app-container">
    <el-tabs v-model="tabValue">
      <el-tab-pane label="我的绩效" name="dashboard">
        <Dashboard v-if="tabValue === 'dashboard'" />
      </el-tab-pane>
      <el-tab-pane label="绩效核查" name="check">
        <Check v-if="tabValue === 'check'" />
      </el-tab-pane>
      <el-tab-pane v-if="checkPermission(['admin'])" label="全部绩效" name="summary">
        <Summary v-if="tabValue === 'summary'" />
      </el-tab-pane>
      <el-tab-pane v-if="checkPermission(['admin'])" label="绩效排名" name="rank">
        <Rank v-if="tabValue === 'rank'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import checkPermission from '@/utils/permission' // 权限判断函数
import Dashboard from './components/dashboard'
import Check from './components/check'
import Summary from './components/summary'
import Rank from './components/rank'

export default {
  name: 'ProjectDetail',
  components: {
    Dashboard,
    Check,
    Summary,
    Rank
  },
  data() {
    return {
      tabValue: 'dashboard'
    }
  },
  methods: {
    checkPermission
  }
}
</script>

<style scoped>
</style>
